<template>
	<view>
		<view class="swiperbox">
			<swiper class="swiper" circular :indicator-dots="true" :autoplay="true" :interval="2000" :duration="500"
				v-if="info.merch_picarr">
				<swiper-item class="swiperitem" v-for="(item,index) in (info.merch_picarr.split(',')).slice(1,info.merch_picarr.split(',').length)">
					<image :src="item"></image>
				</swiper-item>
			</swiper>
		</view>
		<view class="infobox" v-if="info.merch_name">
			<view class="box">
				<view class="leftbox">
					<view class="name">{{info.merch_name}}</view>
					<view class="evaluate"><text>{{info.merch_score}}分</text>已销{{info.sales_num}}</view>
					<view class="tipbox" v-if="info.tags">
						<view class="tipitem" v-for="(item,index) in info.tags.split(',')" :key="index">
							<view>{{item}}</view>
						</view>
					</view>
				</view>
				<view class="rightbox" v-if="info.merch_picarr">
					<image :src="info.merch_picarr.split(',')[0]"></image>
					<view class="concentration">
						<image src="../../static/gz3.png"></image>
						<view>{{info.fans_num}}关注</view>
					</view>
				</view>
			</view>
			<view class="time">营业时间 {{info.opening_time}}</view>
			<view class="addressbox">
				<view>{{info.address}}</view>
				<image src="../../static/phone.png" @click="openpip()"></image>
			</view>
		</view>
		<view style="height: 350rpx;"></view>
		<view class="address_box" v-if="order" @click="open()">
			<image class="address_bj" src="../../static/tit.png"></image>
			<image src="../../static/address.png"></image>
			<view class="text" v-if="order[0]">
				<view class="user_info">
					<view class="namebox">{{ order[0].shouhuoren }}</view>
					<view>{{ order[0].mobile }}</view>
				</view>
				<view class="address">{{ order[0].province }} {{ order[0].city }} {{ order[0].town }}
					{{ order[0].street }}</view>
			</view>
			<view v-if="order.length==0">收货地址</view>
		</view>
		<view class="address_box" v-else @click="open()">
			<image class="address_bj" src="../../static/tit.png"></image>
			<image src="../../static/address.png"></image>
			<view>收货地址</view>
		</view>
		<uni-popup ref="popups" type="bottom">
			<pickup :addresslist="addresslist" @addressid="addressidchange" @close="closed"></pickup>
		</uni-popup>
		<view style="height: 20rpx;"></view>
		<view class="goodsbox">
			<view class="navtit">
				<view class="navitem" v-for="(item,index) in catelist" :key="index" @click="handleone(item,index)">
					<view :class="[index==currone?'actnav':'nav']">
						{{item.title}}
					</view>
				</view>
			</view>
			<!-- <view v-if="currone==1">
				
			</view> -->
			<view class="ordergoods" v-if="currone==0">
				<view class="leftcate">
					<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltolower="lower" >
						<view v-for="(item,index) in cateList" :key="index" class="scroll-view-item"
							@click="handletwo(item,index)">
							<view :style="{'background':item.id==currtwo?'#FFF':'#F7F7F7','color':item.id==currtwo?'#FE5326':'#222'}">{{item.name}}</view>
						</view>
					</scroll-view>
				</view>
				<view class="rightcate">
					<scroll-view id="scrollview" :scroll-top="scrollTops" scroll-y="true" class="scroll-Y"
						:scroll-into-view="viewid" @scroll="scroll">
						<view :id="'viewid'+item.id" v-for="(item,index) in reallylist" :key="index">
							<view  :id="'cate'+item.id"></view>
							<view v-for="(sitem,tindex) in item.goodsList" :key="tindex" class="scroll-view-item"
								@click="totakeway(sitem)">
								<view class="goodsleft">
									<image :src="sitem.url"></image>
								</view>
								<view class="goodsright">
									<view class="goodsnmae">{{sitem.goods_name}}</view>
									<!-- <view class="goodstip">拿铁+布丁+珍珠+奶茶</view> -->
									<view class="sold">已销{{parseInt(sitem.sales_initial)+parseInt(sitem.sales_actual)}}
									</view>
									<view class="pricebox">
										<view class="price">￥{{sitem.goods_price_min}}</view>
										<!-- <view class="numbox">
											<image @click.stop="reduce(item)" src="../../static/jian.png"></image>
											<view>{{item.buy_num}}</view>
											<image @click.stop="add(item)" src="../../static/add.png"></image>
										</view> -->
										<view class="specbut">
											选规格
										</view>
									</view>
								</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
			<view style="height: 100rpx;" v-if="currone==0"></view>
			<view class="navbut" v-if="currone==0" :style="{'z-index':goodspopup==2?5:999}">
				<view class="butbox">
					<view class="breakbox" @click="opengoods()">
						<image src="../../static/car.png"></image>
						<view class="redbox" v-if="totallist.length!==0">{{totallist.length<100?totallist.length:'99+'}}</view>
						<view class="navinfo">
							<view>商品合计<text style="font-size: 18rpx;">(不含配送费)</text></view>
							<view class="navprice">
								<view>￥{{totalPrices||0}}</view>
								<view>配送费￥{{freight_money}}</view>
							</view>
						</view>
					</view>
					<view class="colorbut" @click.stop="tosubmit()">
						去结算
					</view>
				</view>
			</view>
			<uni-popup ref="popup" type="center" :animation="false">
				<view class="modelbox">
					<view class="namebox">拨打电话</view>
					<view class="inputbox">
						{{info.mobile}}
					</view>
					<view class="butbox">
						<view style=" color: #222222;border-top:solid  2rpx #EEEEEE;" @click="close()">取消</view>
						<view style="background: linear-gradient(90deg, #F94D29 0%, #F99529 100%);" @click="callServer">
							拨打</view>
					</view>
				</view>
			</uni-popup>
			<uni-popup ref="bottompopup" type="bottom">
				<modelinfo :addressid="dzindex" v-if="goodsid!==null&&goodsinfo" :info="goodsinfo" @close="close"
					@toorder="toorder" :addorcar="addorcar" :jifen="jifen"></modelinfo>
				<!-- <infos :info="goodsinfo" @getnum="getnum" :nums="num"></infos> -->
			</uni-popup>
			<!-- 购物车弹窗 -->
			<uni-popup ref="goodspopup"  style="bottom: 200rpx;">
				<view class="goodspopupbox">
					<scroll-view  :scroll-top="scrollTops" scroll-y="true" class="scroll-Y">
						<view class="listbox" v-for="(item,index) in totallist" :key="index">
							<view class="imgbox">
								<!-- <image v-if="!item.select" @click="changeSelect(index)" src="../../static/yuan.png"></image> -->
								<image  @click="splicegoods(index)" src="../../static/jian.png"></image>
							</view>
							<view class="goodsimg">
								<image :src="item.goods_images[0].full_url"></image>
							</view>
							<view class="goodsinfo">
								<view class="namebox">{{item.goods_name}}</view>
								<view class="specbox">
									<text v-if="item.specname"  v-for="(s,sindex) in item.specname[0].goods_props" :key="sindex">
										{{s.group.name}}:{{s.value.name}}
									</text>
								</view>
								<view class="pricebox">
									<view class="redbox"><text>￥</text>{{item.info.unit_price}}</view>
									<view class="actbox" v-if="item.info">
										<image @click="reduce(item.info,index)" src="../../static/jian.png"></image>
										<view class="numbox">{{item.info.goods_num[0]||1}}</view>
										<image @click="add(item.info,index)" src="../../static/add.png"></image>
									</view>
								</view>
							</view>
						</view>
					</scroll-view>
					<view style="height: 100rpx;"></view>
				</view>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	import infos from '../../components/takewayinfo.vue'
	import modelinfo from '../../components/takewayinfo.vue'
	import pickup from '../../components/pickup.vue'
	// import { Loading } from "element-ui";
	export default {
		components: {
			infos,
			modelinfo,
			pickup
		},
		data() {
			return {
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				scrollTops: 0,
				olds: {
					scrollTops: 0
				},
				currone: '',
				catelist: [{
					id: 1,
					title: '点餐'
				}],
				currtwo: '',
				id: '',
				info: {},
				cateList: [], //分类
				allGoodsList: [],
				reallylist: [],
				viewid: '',
				goodsinfo: {},
				newinfo: {},
				num: 0,
				addresslist: [],
				freight_money: 0,
				dzindex: '', //默认地址id
				addorcar: null, //布尔值，判断弹窗内容是购物车(true),还是立即购买(false)
				goodsinfo: null, //商品详情
				goodsid: null,
				totallist: [],
				order: null,
				address_id: '',
				topList:[],
				oldScroll:0,
				goodspopup:2,
			}
		},
		watch: {
			'newbackground': function(val) {
				console.log(val, this.newbackground);
				if (val !== this.newbackground) {
					this.counts = 0
					this.totalPrice = 0
				}
				return
			}
		},
		computed: {
			//计算选中商品的总价
			totalPrices() {
				let totalPrices = 0;
				// this.reallylist = uni.getStorageSync('reallylist') || []
				// this.allGoodsList.map(item => {
				// 	totalPrices += item.buy_num * item.goods_price_min
				// })
				console.log(this.totallist,'totallist11')

				this.totallist.map(item => {
					if (item.info) {
						totalPrices += parseInt(item.info.goods_num[0]) * parseFloat(item.info.unit_price)
					}
				})
				// return totalPrices
				return parseFloat(totalPrices.toFixed(2)) // 保留小数点后2位
			}
		},
		onShow() {
			this.selectsId = 0
			this.newbackground = 0
			this.counts = 0
			this.getinfo()
		},
		onLoad(option) {
			this.id = option.id
			this.getcategoods(option.id)
			
		},
		methods: {
			//获取地址
			getaddress() {
				this.$http({
					url: 'api/Wechat/addressList',
					data: {
						token: uni.getStorageSync('token'),
					}
				}).then(res => {
					this.addresslist = res.data
					this.order = res.data.filter(item => item.isdefault == 1)
					if (this.order.length > 0) {
						this.getfee()
					}
				})
			},
			//快递
			addressidchange(result) {
				this.address_id = result
				this.order = this.addresslist.filter(item => item.id == this.address_id)
				console.log(this.address_id, this.order)
				this.getfee()
				this.closed()
			},
			lower: function(e) {
				// console.log(e)
			},
			scroll: function(e) {
				let index = this.reallylist.findIndex((item)=>{
					return item.id == this.currtwo
				})
				if(this.oldScroll > e.detail.scrollTop){
					let prevTop = this.topList[index]
					if(e.detail.scrollTop < prevTop){
						this.currtwo = this.reallylist[index-1].id
					}
				}else{
					let nextTop = this.topList[index+1]
					if(e.detail.scrollTop > nextTop){
						this.currtwo = this.reallylist[index+1].id
					}
				}
				this.oldScroll  = e.detail.scrollTop
			},
			handleone(item, index) {
				this.currone = index
				console.log(this.currone, index)
			},
			handletwo(item, index) {
				this.currtwo = item.id
				this.viewid = 'viewid' + item.id
				console.log(this.viewid)
			},
			getinfo() {
				this.$http({
					url: 'api/Wechat/storeDetail',
					data: {
						store_id: this.id
					}
				}).then(async res => {
					this.info = res.data.detail
					this.getaddress()
					this.cateList = res.data.cateList
					let that = this
					that.topList = []
					let top = await this.getTop()
					this.reallylist.forEach((item) => {
						let query = uni.createSelectorQuery().in(this);
						query.select(`#cate${item.id}`).boundingClientRect(da => {
							that.topList.push(da.top - top)
						}).exec();
					})
					// this.allGoodsList = res.data.allGoodsList
					// this.allGoodsList.forEach(item=>{
					// 	item.buy_num = 0
					// })
					this.getaddress()
				})
			},
			getTop() {
				const query = uni.createSelectorQuery().in(this);
				return new Promise((resolve, reject) => {
					query.select(`#scrollview`).boundingClientRect(data => {
						resolve(data.top)
					}).exec();
				})
			},
			getcategoods(id) {
				this.$http({
					url: 'api/Wechat/getGoodsByMerchId',
					data: {
						merch_id: +this.id,
					}
				}).then(res => {
					this.reallylist = res.data
					// this.reallylist.forEach(item => {
					// 	item.goodsList.forEach(sitem => {
					// 		this.allGoodsList.push(sitem)
					// 	})
					// })
				})
			},
			splicegoods(index){
				this.totallist.splice(index,1)
			},
			//减
			reduce(info,index) {
				if ((+info.goods_num[0]) == 1) {
					uni.showToast({
						title: '不能再减了哟！',
						icon: 'none'
					})
				} else {
					this.totallist[index].info.goods_num[0]--
				}
				this.totallist.push(...[])
				console.log(info.goods_num[0],this.totallist)
			},
			add(info,index) {
				if ((+info.goods_num[0]) >= info.stock_total) {
					uni.showToast({
						title: '数量已超过库存了',
						icon: 'none'
					})
				} else {
					this.totallist[index].info.goods_num[0]++
					 // info.goods_num[0]=info.goods_num[0]++
				}
				this.totallist.push(...[])
				console.log(info.goods_num[0],this.totallist)
				
			},
			callServer() {
				uni.makePhoneCall({
					phoneNumber: this.info.mobile
				})
			},
			open() {
				this.goodspopup = 2
				this.$refs.popups.open('bottom')
			},
			closed() {
				this.goodspopup = 2
				this.$refs.goodspopup.close()
				this.$refs.popups.close()
			},
			opengoods(){
				if (this.totallist.length>0) {
					this.goodspopup = 1
					this.$refs.goodspopup.open('bottom')
				}
			},
			close() {
				this.goodspopup = 2
				this.$refs.popup.close()
				this.$refs.bottompopup.close()
				this.$refs.goodspopup.close()
			},
			openpip() {
				this.$refs.popup.open('center')
			},
			totakeway(item) {
				this.num = parseInt(item.buy_num)
				this.goodsinfo = {}
				// this.getgoodsinfo(item.id)
				this.$http({
					url: 'api/Wechat/goodsDetail',
					data: {
						goods_id: item.id
					}
				}).then(res => {
					this.goodsinfo = res.data.goodsInfo
					this.goodsid = parseInt(item.id)
					this.goodspopup = 2
					if (this.goodsid !== null) {
						this.$refs.bottompopup.open('bottom')
					}
					this.addorcar = false
					this.jifen = false

					//判断弹窗内容是购物车(true),还是立即购买(false)
					console.log(this.goodsinfo, 'goodsinfo')
				})
			},
			getnum(result) {
				this.newinfo = result
				const a = this.allGoodsList.findIndex(item => item.id == this.newinfo.id)
				this.allGoodsList[a].buy_num = this.newinfo.num
				this.$refs.bottompopup.close()
				console.log(result, 'result', a)
			},
			//立即购买去下单
			toorder(result) {


				const list = []
				this.goodsinfo.info = result
				// console.log(result, 'result', result.goods_num[0], result.goods_num)
				this.goodsinfo.carnum = parseInt(result.goods_num[0])
				// this.goodsinfo.carnum = result.goods_num[0]
				list.push(this.goodsinfo)
				const palce = this.totallist.findIndex(item => item.info.goods_id[0] == result.goods_id[0] && item.info
					.spec_id == result.spec_id)
				console.log(palce,this.totallist,'this.totallist')
				if (palce !== -1) {
					this.totallist[palce].info.goods_num[0] = parseInt(result.goods_num[0])+parseInt(this.totallist[palce].info.goods_num[0])
					// this.totallist[palce].info.goods_num[0] = result.goods_num[0]
				} else {
					this.totallist.push(this.goodsinfo)
				}
				// this.totallist.push(this.goodsinfo)
				this.totallist.push(...[])
				console.log(result, list, 'result',this.totallist)
				this.$refs.bottompopup.close()

				// uni.navigateTo({
				// 	url:'/pageshop/submitorder/submitorder?list='+encodeURIComponent(JSON.stringify(list)) 
				// })
			},
			//获取配送费
			getfee() {
				this.$http({
					url: 'api/Wechat/getShippingFee',
					data: {
						merch_id: this.info.id,
						address_id: this.order[0].id
					}
				}).then(res => {
					this.freight_money = res.data.freight_money
				})
			},

			tosubmit() {
				if (this.totallist.length == 0) {
					uni.showToast({
						title: '请选择商品',
						icon: 'none'
					})
					return
				}
				if (this.order.length == 0) {
					uni.showToast({
						title: '请选择地址',
						icon: 'none'
					})
					return
				}
				console.log(this.totallist, 'totallist')
				// const list = this.allGoodsList.filter(item=>item.buy_num!==0)
				uni.navigateTo({
					url: '/pageshop/Information/Information?list=' + encodeURIComponent(JSON.stringify(this
						.totallist)) + '&is_supermarket=' + this.info.is_supermarket
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.swiperbox {
		width: 750rpx;
		height: 422rpx;

		.swiper {
			height: 422rpx;

			.swiperitem {
				display: block;
				height: 422rpx;
				line-height: 422rpx;
				text-align: center;

				image {
					width: 750rpx;
					height: 422rpx;
				}
			}
		}
	}

	.infobox {
		width: 690rpx;
		// height: 350rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		position: absolute;
		z-index: 9;
		left: 50%;
		transform: translate(-50%, 0);
		margin-top: -42rpx;

		.box {
			padding: 0 20rpx;
			width: 650rpx;
			display: flex;
			align-items: center;

			.leftbox {
				width: 450rpx;

				.name {
					font-size: 36rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					font-weight: 500;
					color: #000000;
					height: 90rpx;
					line-height: 90rpx;
				}

				.evaluate {
					font-size: 26rpx;
					font-family: Source Han Sans CN-Regular, Source Han Sans CN;
					font-weight: 400;
					color: #555555;
					margin-bottom: 20rpx;

					>text {
						font-size: 26rpx;
						font-family: Source Han Sans CN-Regular, Source Han Sans CN;
						font-weight: 400;
						color: #F99529;
						margin-right: 24rpx;
					}
				}

				.tipbox {
					display: flex;
					align-items: center;
					flex-wrap: wrap;
					margin-right: 24rpx;

					.tipitem {
						width: fit-content;
						padding: 0 6rpx;
						height: 34rpx;
						line-height: 34rpx;
						background: linear-gradient(90deg, #FFE9E1 0%, #FFF8F5 100%);
						border-radius: 8rpx;
						font-size: 18rpx;
						font-family: Source Han Sans CN-Regular, Source Han Sans CN;
						font-weight: 400;
						color: #FF6229;
						margin-right: 18rpx;
					}
				}
			}

			.rightbox {
				width: 200rpx;
				text-align: center;

				image {
					width: 80rpx;
					height: 80rpx;
					border-radius: 7rpx;
				}

				.concentration {
					display: flex;
					align-items: center;
					font-size: 24rpx;
					font-family: PingFang SC-Medium, PingFang SC;
					font-weight: 500;
					color: #444444;

					image {
						width: 56rpx;
						height: 56rpx
					}
				}
			}
		}

		.time {
			height: 98rpx;
			line-height: 98rpx;
			font-size: 28rpx;
			font-family: Source Han Sans CN-Regular, Source Han Sans CN;
			font-weight: 400;
			color: #222222;
			padding: 0 20rpx;
		}

		.addressbox {
			display: flex;
			border-top: solid 2rpx #F1F1F1;
			min-height: 98rpx;
			align-items: center;
			padding: 0 20rpx;
			justify-content: space-between;

			>view {
				width: 550rpx;
				-webkit-line-clamp: 2;
				display: -webkit-box;
				-webkit-box-orient: vertical;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			image {
				width: 39rpx;
				height: 39rpx;
			}
		}
	}

	.goodsbox {
		width: 750rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		position: relative;

		.navtit {
			display: flex;
			align-items: center;
			width: 690rpx;
			margin: 0 auto;
			height: 84rpx;
			border: 2rpx solid #F5F5F5;

			.navitem {
				padding: 0 20rpx;
				height: 84rpx;

				.nav {
					height: 84rpx;
					line-height: 84rpx;
					border-bottom: 6rpx #FFF solid;
				}

				.actnav {
					height: 84rpx;
					line-height: 84rpx;
					border-bottom: 6rpx #F94D29 solid;
				}
			}
		}

		.ordergoods {
			display: flex;
			align-items: center;
			margin-top: 6rpx;

			.leftcate {
				width: 178rpx;
				background-color: #F7F7F7;

				.scroll-Y {
					height: 800rpx;

					.scroll-view-item {
						height: 102rpx;
						line-height: 102rpx;
						text-align: center;
						font-size: 28rpx;
						font-family: Source Han Sans CN-Regular, Source Han Sans CN;
						font-weight: 400;
						color: #222222;
					}
				}
			}

			.rightcate {
				width: 572rpx;

				.scroll-Y {
					height: 800rpx;

					.scroll-view-item {
						// height: 210rpx;
						margin-top: 30rpx;
						font-size: 28rpx;
						font-family: Source Han Sans CN-Regular, Source Han Sans CN;
						font-weight: 400;
						color: #222222;
						display: flex;
						align-items: center;

						.goodsleft {
							width: 228rpx;
							text-align: center;

							image {
								width: 180rpx;
								height: 180rpx;
								border-radius: 20rpx;
							}
						}

						.goodsright {
							width: 325rpx;

							.goodsnmae {
								width: 325rpx;
								font-size: 30rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #000000;
								-webkit-line-clamp: 2;
								display: -webkit-box;
								-webkit-box-orient: vertical;
								overflow: hidden;
								text-overflow: ellipsis;
							}

							.goodstip {
								font-size: 24rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #555555;
								line-height: 72rpx;
							}

							.sold {
								font-size: 20rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #888888;
							}

							.pricebox {
								display: flex;
								align-items: center;
								margin-top: 20rpx;

								.price {
									width: 175rpx;
									font-size: 30rpx;
									font-family: SourceHanSansCN-Medium-, SourceHanSansCN-Medium;
									font-weight: normal;
									color: #FE5326;
								}

								.specbut {
									width: 120rpx;
									height: 40rpx;
									font-size: 26rpx;
									color: #FFF;
									text-align: center;
									line-height: 40rpx;
									background: linear-gradient(180deg, #F94D29 0%, #F99529 100%);
									border-radius: 20rpx;
								}

								.numbox {
									width: 150rpx;
									display: flex;
									align-items: center;

									image {
										width: 40rpx;
										height: 40rpx;
										border-radius: 100%;
									}

									>view {
										width: 60rpx;
										text-align: center;
										font-size: 28rpx;
										font-family: Source Han Sans CN-Medium, Source Han Sans CN;
										font-weight: 500;
										color: #333333;
									}
								}
							}
						}
					}
				}
			}
		}

		.navbut {
			width: 690rpx;
			height: 96rpx;
			background: #F7F7F7;
			position: fixed;
			bottom: 0;
			left: 50%;
			transform: translate(-50%, 0);

			.butbox {
				width: 690rpx;
				height: 96rpx;
				border-radius: 48rpx;
				display: flex;

				.breakbox {
					width: 480rpx;
					height: 96rpx;
					color: #FFF;
					display: flex;
					align-items: center;
					background-color: #000000;
					border-radius: 48rpx 0 0 48rpx;

					image {
						width: 44rpx;
						height: 42rpx;
						margin: 0 30rpx 0 26rpx;
					}
					.redbox{
						width: 45rpx;
						height: 45rpx;
						text-align: center;
						color: #FFF;
						line-height: 45rpx;
						position: absolute;
						background-color: red;
						border-radius: 100%;
						font-size: 23rpx;
						top: 0;
						left: 50rpx;
					}

					.navinfo {
						width: 350rpx;
						font-size: 24rpx;
						font-family: Source Han Sans CN-Regular, Source Han Sans CN;
						font-weight: 400;

						.navprice {
							width: 350rpx;
							display: flex;
							align-items: center;
							justify-content: space-between;
						}
					}
				}

				.colorbut {
					width: 210rpx;
					height: 96rpx;
					line-height: 96rpx;
					text-align: center;
					background: linear-gradient(180deg, #F94D29 0%, #F99529 100%);
					border-radius: 0rpx 48rpx 48rpx 0rpx;
					font-size: 30rpx;
					font-family: PingFang SC-Bold, PingFang SC;
					font-weight: bold;
					color: #FFFFFF;
				}
			}
		}
	}

	// 客服电话
	.modelbox {
		width: 528rpx;
		height: 289rpx;
		background: #FFFFFF;
		border-radius: 14rpx;
		margin: 0 auto;
		padding-top: 30rpx;

		.namebox {
			width: 128rpx;
			margin: 0rpx auto 30rpx auto;
			height: 44rpx;
			font-size: 32rpx;
			font-family: PingFang SC-Bold, PingFang SC;
			font-weight: bold;
			color: #222222;
			background: linear-gradient(180deg, #FFF 70%, #ffebe7 100%);
		}

		.inputbox {
			width: 430rpx;
			height: 84rpx;
			padding: 0 20rpx;
			background: #F7F7F7;
			border-radius: 16rpx;
			margin: 0 auto;
			display: flex;
			align-items: center;
		}

		.butbox {
			display: flex;
			height: 78rpx;
			width: 528rpx;
			margin-top: 52rpx;

			>view {
				height: 78rpx;
				width: 264rpx;
				background-color: #FFF;
				font-size: 30rpx;
				font-family: Source Han Sans CN-Regular, Source Han Sans CN;
				font-weight: 400;
				color: #FFFFFF;
				text-align: center;
				line-height: 78rpx;
			}
		}
	}

	// 收货地址
	.address_box {
		width: 750rpx;
		height: 149rpx;
		background: #FFFFFF;
		border-radius: 0rpx 0rpx 10rpx 10rpx;
		padding: 34rpx 30rpx;
		display: flex;
		align-items: center;
		box-sizing: border-box;
		gap: 0 20rpx;
		margin-top: 16rpx;
		position: relative;

		.address_bj {
			position: absolute;
			width: 100%;
			height: 14rpx;
			bottom: 0;
			left: 0;
		}

		image {
			width: 60rpx;
			height: 60rpx;
			flex-shrink: 0;
		}

		.text {
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: space-between;

			.user_info {
				display: flex;
				align-items: center;
				gap: 0 20rpx;
				font-size: 32rpx;
				font-family: Source Han Sans CN-Regular, Source Han Sans CN;
				font-weight: 400;
				color: #222222;
				line-height: 1em;

				.namebox {
					max-width: 300rpx;
					-webkit-line-clamp: 1;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					overflow: hidden;
					text-overflow: ellipsis;
				}
			}

			.address {
				font-size: 28rpx;
				font-family: Source Han Sans CN-Regular, Source Han Sans CN;
				font-weight: 400;
				color: #555555;
				line-height: 1em;
				-webkit-line-clamp: 1;
				display: -webkit-box;
				-webkit-box-orient: vertical;
				overflow: hidden;
				text-overflow: ellipsis;
			}
		}
	}
	.goodspopupbox{
		background-color: #FFF;
		.scroll-Y{
			height: 600rpx;
			.listbox{
				display: flex;
				align-items: center;
				width: 690rpx;
				background-color: #FFF;
				padding: 30rpx;
				margin-bottom: 24rpx;
				.imgbox{
					width: 10%;
					image{
						width: 40rpx;
						height: 40rpx;
						border-radius: 100%;
					}
				}
				.goodsimg{
					width: 33%;
					image{
						width: 110rpx;
						height: 110rpx;
						background: #999999;
						border-radius: 6rpx ;
					}
				}
				.goodsinfo{
					width: 57%;
					.namebox{
						font-size: 28rpx;
						font-family: Source Han Sans CN-Medium, Source Han Sans CN;
						font-weight: 500;
						color: #222222;
						-webkit-line-clamp: 2;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						overflow: hidden;
						text-overflow: ellipsis;
					}
					.specbox{
						font-size: 24rpx;
						font-family: Source Han Sans CN-Regular, Source Han Sans CN;
						font-weight: 400;
						color: #555555;
						margin: 24rpx 0 40rpx 0;
						>text{
							margin-right: 5rpx;
						}
					}
					.pricebox{
						display: flex;
						justify-content: space-between;
						align-items: center;
						.redbox{
							font-size: 36rpx;
							font-family: Source Han Sans CN-Medium, Source Han Sans CN;
							font-weight: 500;
							color: #FE5326;
							>text{
								font-size: 28rpx;
							}
						}
						.actbox{
							display: flex;
							align-items: center;
							image{
								width: 40rpx;
								height: 40rpx;
								border-radius: 100%;
							}
							.numbox{
								min-width: 80rpx;
								font-size: 28rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #333333;
								text-align: center;
							}
						}
					}
				}
			}
		}
	}
</style>